<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<%--
  Created by IntelliJ IDEA.
  User: 华哥
  Date: 2021/5/8
  Time: 11:39
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>

    <title>药单缴费</title>
    <%
        //获取项目的根路径
        String path = request.getContextPath();
        String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
    %>
    <meta charset="utf-8">
    <title>Title</title>
    <meta charset="utf-8">
    <title>Title</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

    <link rel="stylesheet" href="<%=basePath%>static/layui-v2.6.5/layui/css/layui.css">
    <script type="text/javascript" src="<%=basePath%>static/layui-v2.6.5/layui/layui.js"></script>
    <link rel="stylesheet" type="text/css" href="<%=basePath%>static/swee/sweetalert.css">
    <script type="text/javascript" src="<%=basePath%>static/swee/sweetalert-dev.js"></script>

    <style type="text/css">

        /*缴费*/
        .cost {
            background: #009f95;
            width: 60px;
            height: 30px;
            border-radius: 5px 5px 5px 5px;
            text-align: center;
            line-height: 30px;
            display: inline-block;
            color: white;
        }

        /*详情*/
        .details {
            background: #009f95;
            width: 60px;
            height: 30px;
            border-radius: 5px 5px 5px 5px;
            text-align: center;
            line-height: 30px;
            display: inline-block;
            color: white;
        }

        .details:hover {
            color: red;
        }

        .cost:hover {
            color: red;
        }

        .an {
            background: #009f95;
            width: 100px;
            height: 30px;
            border-radius: 10px 10px 10px 10px;
            text-align: center;
            line-height: 30px;
            display: inline-block;
            color: white;
            border: none;
        }

        form {
            margin-top: 20px;
            text-align: center;

        }

        input[type="text"] {
            height: 25px;
        }

        .liui {
            border: 1px transparent solid;
            background-color: transparent;
        }

        .span {
            display: inline-block;
            width: 100px;
            height: 30px;
            text-align: center;
            line-height: 30px;
        }

    </style>

</head>

<body>
<form action="<%=basePath%>Medicine/MedicineList" method="post">
    患者姓名：<input type="text" name="name">
    <input type="submit" value="查询" class="an">
</form>
<div class="layui-form">
    <table class="layui-table">
        <colgroup>
            <col width="150">
            <col width="150">
            <col width="200">
            <col>
        </colgroup>
        <thead>
        <tr>
            <td>编号</td>
            <td>用户编号</td>
            <td>用户姓名</td>
            <td>开药数量</td>
            <td>开药时间</td>
            <td>开单医生</td>
            <td>操作</td>
        </tr>
        </thead>
        <tbody>
        <c:forEach var="list" items="${page.list}">
            <tr>
                <td>${list.id}</td>
                <td>${list.userid}</td>
                <td>${list.username}</td>
                <td>${list.count}</td>
                <td>${list.time}</td>
                <td>${list.doctorInformation.doctorname}</td>
                <td>
                    <a href="javascript:void(0)" class="cost">缴费</a>
                    <a href="javascript:void(0)" class="details">详情</a>
                </td>
            </tr>
        </c:forEach>
        </tbody>
    </table>

</div>

<p style="text-align: center; ">

    <a href="<%=basePath%>Medicine/MedicineList?curr=${page.firstPage}&name=${name}">首页</a>
    <a href="<%=basePath%>Medicine/MedicineList?curr=${page.prePage}&name=${name}">上一页</a>
    <a href="<%=basePath%>Medicine/MedicineList?curr=${page.nextPage}&name=${name}">下一页</a>
    <a href="<%=basePath%>Medicine/MedicineList?curr=${page.lastPage}&name=${name}">尾页</a>

</p>

<script src="<%=basePath%>static/jquery/jquery-1.12.4.js"></script>

<script type="text/javascript">
    $(function () {
        //缴费
        $(".cost").click(function () {
            let userid = $(this).parent().parent().find("td:eq(1)").text();  //用户编号
            let date = $(this).parent().parent().find("td:eq(4)").text();    //开药时间
            $.ajax({
                url: "<%=basePath%>Medicine/payment",
                data: {
                    userid: userid,
                    date: date
                },
                type: "post",
                dataType: "json",
                success: function (data) {
                    if (data) {
                        $.ajax({
                            url: "<%=basePath%>Medicine/money",
                            type: "post",
                            data: {
                                userid: userid,
                                date: date
                            },
                            dateType: "json",
                            success: function (data) {
                                let money = "本次缴费" + data + "元";
                                swal({
                                    title: "缴费成功",
                                    text: money
                                }, function () {
                                    location.reload()
                                })
                            }
                        })
                    } else {
                        swal("余额不足");
                    }
                }
            });
        })
        //查看详情
        $(".details").click(function () {

            let userid = $(this).parent().parent().find("td:eq(1)").text();  //用户编号
            let date = $(this).parent().parent().find("td:eq(4)").text();    //开药时间

            $.ajax({
                url: "<%=basePath%>Medicine/details",
                type: "post",
                data: {
                    userid: userid,    //用户编号
                    date: date         //开药时间
                },
                dataType: "json",
                success: function (data) {
                    let lis = ``;   //每条记录
                    let money = 0;  //总价格
                    $.each(data, function (index, val) {
                        let price = parseInt(val.drugRemedy.price) * parseInt(val.sum);
                        money += price;
                        lis += `<li class="liui">
                                   <span class="span">\${val.drugRemedy.drugname}</span>
                                   <span class="span">\${val.drugRemedy.price}</span>
                                   <span class="span">\${val.sum}</span>
                                   <span class="span">\${val.type}</span>
                                </li>`;
                    })
                    let show = `<div>
                                   <ul>
                                      <li class="liui">
                                         <span class="span">药品名称</span>
                                         <span class="span">药品价格</span>
                                         <span class="span">药品数量</span>
                                         <span class="span">用法用量</span>
                                      </li>
                                      \${lis}
                                      <li class="liui">
                                         <span class="span"></span>
                                         <span class="span"></span>
                                         <span class="span">金额总计</span>
                                         <span class="span">\${money}</span>
                                      </li>
                                   </ul>
                                </div>`
                    swal({
                        title: "药单详情",    //标题
                        text: show,         //测试
                        allowEscapeKey: true,  //ESC退出
                        confirmButtonText: "关闭",    //确定按钮文字描叙
                        html: true,
                    });
                }
            })
        })
    })

</script>
</body>
</html>
